<template>
  <div>
    <p>{{msg}}</p>
    <button @click="obj={}">点击</button>
  </div>
</template>

<script>
export default {
  name: 'VueliDemoApp',

  data() {
    return {
      msg :"8",
      obj:{
        name:"郑品",
        age:'18',
        count:12,
      }
    };
  },

  mounted() {
    
  },
  methods: {
    
    
  },
  watch: {
      msg(newval,oldval){
        console.log("改变之后的值",newval);
        console.log('改变之前的值',oldval);
      },
      // "obj.name"(n,o){
      //    console.log("改变之后的值",n);
      //   console.log('改变之前的值',o);
      // },
      // obj(n,o){
      //    console.log("改变之后的值",n);
      //   console.log('改变之前的值',o);
      // },
      obj:{
        handler(newval){
          console.log(newval.count);
        },
        deep:true,
        immediate:true,
      }

    }
};
</script>

<style lang="scss" scoped>

</style>